<!-- 场馆负责人首页 -->
<template>
  <div class="home-wrap">
    <!--  <el-dialog
      title="负责人信息"
      :visible.sync="dialogFormVisible"
      :show-close="false"
      :close-on-click-modal="false"
      :close-on-press-escape="false"
    >
      <el-form :model="suppliersForm" ref="suppliersForm" :rules="rules" style="padding:0 50px">
        <el-form-item label="公司名称" :label-width="formLabelWidth" prop="suppliersName">
          <el-input
            v-model="suppliersForm.suppliersName"
            autocomplete="off"
            placeholder="请务必填写正确的公司名称"
          ></el-input>
        </el-form-item>
        <el-form-item label="联系方式" :label-width="formLabelWidth" prop="suppliersPhone">
          <el-input
            v-model="suppliersForm.suppliersPhone"
            autocomplete="off"
            placeholder="请留一个公司的联系方式"
          ></el-input>
        </el-form-item>
        <el-form-item label="联系地址" :label-width="formLabelWidth" prop="suppliersAddress">
          <el-input
            v-model="suppliersForm.suppliersAddress"
            autocomplete="off"
            placeholder="请填写正确的联系地址"
          ></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="resetSuppliersForm('suppliersForm')" style="margin-right:15px">重 置</el-button>
        <el-button type="primary" @click="submitSuppliersForm('suppliersForm')">提 交</el-button>
      </div>
    </el-dialog>-->
    <!-- Home样式 -->
    <el-container class="home-container">
      <!-- 头部区域 -->
      <el-header>
        <div class="el-dropdown-link divLog">yoga场馆管理系统</div>

        <div class="el-dropdown-link" style="width:5%;margin-left:30px">
          <el-avatar
            :size="40"
            style="margin-top:10px"
            src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fimg.zcool.cn%2Fcommunity%2F01a1385ffaa49311013ee04db749e8.jpg%401280w_1l_2o_100sh.jpg&refer=http%3A%2F%2Fimg.zcool.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1659158293&t=bf1b96c39fa70e1b11c3ae46296ee2b2"
          ></el-avatar>
        </div>
      </el-header>
      <el-container>
        <!-- 侧边栏 -->
        <el-aside width="200px">
          <div style="height:20px"></div>
          <el-menu default-active="1" class="el-menu-vertical-demo" background-color="#fff">
            <el-submenu index="1">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>场馆管理</span>
              </template>
              <router-link to>
                <el-menu-item index="1-1">注册场馆</el-menu-item>
              </router-link>
              <router-link to>
                <el-menu-item index="1-2">场馆审核</el-menu-item>
              </router-link>
              <router-link to>
                <el-menu-item index="1-3">排课管理</el-menu-item>
              </router-link>
            </el-submenu>
            <el-submenu index="2">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>人事管理</span>
              </template>
              <router-link to>
                <el-menu-item index="2-1">注册场馆</el-menu-item>
              </router-link>
              <router-link to>
                <el-menu-item index="2-2">场馆审核</el-menu-item>
              </router-link>
              <router-link to>
                <el-menu-item index="2-3">排课管理</el-menu-item>
              </router-link>
            </el-submenu>
            <el-submenu index="3">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>排课管理</span>
              </template>
              <el-menu-item index="3-1">注册场馆</el-menu-item>
              <el-menu-item index="3-2">场馆审核</el-menu-item>
              <el-menu-item index="3-3">排课管理</el-menu-item>
            </el-submenu>
            <el-submenu index="4">
              <template slot="title">
                <i class="el-icon-location"></i>
                <span>会员管理</span>
              </template>
              <el-menu-item index="4-1">注册场馆</el-menu-item>
              <el-menu-item index="4-2">场馆审核</el-menu-item>
              <el-menu-item index="4-3">排课管理</el-menu-item>
            </el-submenu>
          </el-menu>
        </el-aside>
        <!-- 右侧内容主题 -->
        <el-main>
          <!-- 路由占位符 -->
          <router-view></router-view>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>

<script>
export default {
  mounted() {
    // this.dialogFormVisible = false;
    // let config = {
    //   headers: {
    //     "Content-Type": "text/plain",
    //   },
    // };
    // // 通过登录路由传来的参数，利用session会话来存储
    // if (this.$route.query.usersId !== undefined) {
    //   window.localStorage.setItem("usersIdSupplies", this.$route.query.usersId)
    // }
    // this.usersId = window.localStorage.getItem('usersIdSupplies');
    // // 查询当前账户的商家信息是否存在
    // this.$axios.post("suppliers/findByConditions", this.usersId, config).then((response) => {
    //   let r = response.data;
    //   // 没有有商家id 打开提交商家信息的弹框表单，默认弹窗默认是关闭的
    //   if (r.data === null) {
    //     this.dialogFormVisible = true;
    //     return;
    //   }
    //   this.suppliersId = r.data.suppliersId;
    // });
  },
  data() {
    return {
      // dialogFormVisible: false,
      // formLabelWidth: '120px',
      // usersId: "",
      // suppliersId: "",
      // rules: {
      //   suppliersName: [
      //     { required: true, message: '未输入公司名称', trigger: 'blur' },
      //   ],

      //   suppliersPhone: [
      //     { required: true, message: '未输入联系方式', trigger: 'blur' },
      //     {
      //       pattern: /(^(0[0-9]{2,3}\-)?([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$)|(^((\(\d{3}\))|(\d{3}\-))?(1[3578]\d{9})$)|(^(400)-(\d{3})-(\d{4})(.)(\d{1,4})$)|(^(400)-(\d{3})-(\d{4}$))/, message: '号码格式错误', trigger: "blur"
      //     }
      //   ],
      //   suppliersAddress: [
      //     { required: true, message: '未输入联系地址', trigger: 'blur' },

      //   ]
      // },
      // suppliersForm: {
      //   usersId: "",
      //   suppliersName: "",
      //   suppliersPhone: "",
      //   suppliersAddress: "",
      //   suppliersStatus: "正常"
      // }

    }
  },
  methods: {
    // // 重置商家表单
    // resetSuppliersForm(formName) {
    //   this.$refs[formName].resetFields();
    // },
    // //提交商家信息表单
    // submitSuppliersForm(formName) {
    //   this.suppliersForm.usersId = this.$route.params.id;
    //   this.$refs[formName].validate((valid) => {
    //     if (valid) {
    //       this.$axios.post("suppliers/save", this.suppliersForm).then((response) => {
    //         let r = response.data;
    //         if (r.code == 200) {
    //           this.dialogFormVisible = false;
    //           this.$message({
    //             message: '信息录入成功',
    //             type: "success"
    //           });
    //         };
    //         if (r.code == 500) {
    //           this.$message({
    //             message: '信息录入失败，请重新提交',
    //             type: "error"
    //           });
    //         }
    //       });
    //     } else {
    //       return false;
    //     }
    //   });

    // },
    // handleCommand(command) {
    //   if (command == "修改密码") {
    //     console.log("修改密码");

    //   };
    //   if (command == "退出") {
    //     console.log("退出");
    //   }
    // },
    // logout() {
    //   // window.sessionStorage.clear()
    //   // this.$router.push('/login')
    //   console.log("退出");
    // }
  }
}
</script>

<style scoped>
* {
  padding: 0;
  margin: 0;
}

.home-wrap {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
.home-container {
  height: 100%;
}
.el-header {
  /* background-color: #4b5259; */
  background-color: #333744;
  color: #fff;
}

/* 导航条样式 */
.el-dropdown-link {
  display: inline-block;
  height: 50px;
}

/* log样式 */
.divLog {
  /* margin-top: 10px; */
  width: 80%;
  margin-left: 50px;
  font-size: 30px;
}

.el-aside {
  /* background-color: #333744; */
  background-color: #fff;
}
.el-main {
  background-color: #eaedf1;
  padding: 15px;
}

.el-menu-item {
  width: 200px;
  margin-left: 20px;
}

a {
  text-decoration: none;
}
</style>
